<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>首页</title>
    <link rel="stylesheet" href="__CSS__/supplies/bootstrap.min.css">
    <link rel="stylesheet" href="__CSS__/loading.css">
    <!--<link rel="stylesheet" href="/icon/css/font-awesome.min.css">-->
    <link rel="stylesheet" href="__CSS__/supplies/common.css">
    <link rel="stylesheet" href="__CSS__/supplies/index.css">
    <style>
        /*vue 数据为渲染前隐藏*/
        [v-cloak] {
            display: none;
        }
        /*覆盖 layer样式*/
        .layer_btn_save{
            width: 140px;
            height: 32px;
            text-align: center;
            margin-top: -1px;
            background-color: white;
            margin-left: -16px;
            color: #666;
            line-height: 30px;
            cursor: pointer;
            border: 1px solid #DEDEDE;
            margin-right: -16px;
            float: left;
        }
        /*修改 layer 弹出框样式 */
        .layui-layer-btn .layui-layer-btn0{
            margin-right: 20px;
        }
        .layui-layer-btn .layui-layer-btn1{
            color: #fff;
            width: 140px;
            height: 32px;
            text-align: center;
            line-height: 30px;
            border: 0;
            background: -webkit-linear-gradient(left,  #FE5004,#FF9B02);
            background: -moz-linear-gradient(left,  #FE5004,#FF9B02);
            background: -o-linear-gradient(left,  #FE5004,#FF9B02);
            background: linear-gradient(left,  #FE5004,#FF9B02);
            background: #FF9B02 \9;
        }
        .shop_container{
            margin: 32px 0 0 0;
            width: 100%;
            background-color: white;
            padding:10px 10px 10px 40px;
            -moz-box-shadow:0px 5px 30px rgba(114,113,112,0.2); -webkit-box-shadow:0px 5px 30px rgba(114,113,112,0.2); box-shadow:0px 5px 30px rgba(114,113,112,0.2);
        }

        .shop_img{
            float: left;
            border-radius: 40px;
            overflow: hidden;
            width: 80px;height: 80px

        }
        .shop_img img{
            width: 100%;
            height: 100%;
        }

        .shop_name{
            float:left;
            margin-left:20px;
        }
        .shop_name_title{
            margin-top:15px;
        }
        .shop_score{
            float: left;
            overflow: hidden;
            margin-top: 10px;
        }
        .score_title{
            padding-top: 5px;
            float: left;
        }

        .score_show{
            float: left;
            margin-top: 8px;
            margin-left: 15px;
            overflow: hidden;
        }
        .score_half_img{
            float: left;
            width: 13px;
            height: 14px;
            margin-right: 10px;
            background-image: url("/image/supplies/star1.png");
            background-size: 100% 100%;
        }

        .score_fill_img{
            float: left;
            width: 13px;
            height: 14px;
            margin-right: 10px;
            background-image: url("/image/supplies/star1.png");
            background-size: 100% 100%;
        }
        .score_img{
            float: left;
            width: 13px;
            height: 14px;
            margin-right: 10px;
            background-image: url("/image/supplies/star0.png");
            background-size: 100% 100%;
        }

    </style>
</head>
<body>
<div id="homeVue" class="index_container" v-cloak>
    <div class="navbar-default index_nav" style="position:relative">
        <div class="index_user">
            <div class="index_user_header"style="word-break:break-all;word-wrap:break-word; " >
                <div class="float-l index_user_img"  style="vertical-align:middle;">
                    <img :src="url+image" alt="">
                </div>
                <div class="index_user_name font_size_18 float-l" style="width: calc(100% - 45px);word-break:break-all;word-wrap:break-word; ">{{name}}</div>
                <div class="index_user_name logout font_size_18 float-l" style="margin-left:45px;font-size: 14px;line-height: 28px;cursor: pointer;">退出</div>
                <div class="clear-float"></div>
            </div>
        </div>
        <nav>
            <ul class="sidebar-menu" id="sidebar-menu" >
                <!--<li class="header">导航菜单</li>-->
                <menu-item :item="item" v-for="item in menuList"></menu-item>
            </ul>
        </nav>
        <!--<div class="logout">退出登陆</div>-->
    </div>
    <div class="content">
        <div class="shop_container" v-if="(navTitle == '店铺管理')">
            <div class="shop_img">
                <img :src="url+image" alt="">
            </div>
            <div class="shop_name">
                <div class="shop_name_title">
                    <span class="font_size_16">{{name}}<br></span>
                </div>
                <div class="shop_score ">
                    <div class="score_title">
                        <div class="title_zh" class="font_size_14">
                            评分<span class="bg-color-en" style="margin-left:5px">(score)</span>
                        </div>
                    </div>
                    <div class="score_show"  v-html="score(star)"></div>
                </div>
            </div>
            <div class="clear-float"></div>
        </div>
        <div v-if="!(navTitle == '首页')" class="content_title form-inline">
            <div v-for="item in navTitleArray" class="form-inline form-group">
                <div class="form-group font_size_14">
                    <span class="bg-color-cn" style="color: #333;">{{item.navTitle}}</span><br/>
                    <span class="bg-color-en" style="color: #666;">{{item.e_navTitle}}</span>
                </div>
                <div v-if="item.titleImg > 0" class="form-group titleImg">
                    <img src="/image/supplies/header_img.png">
                </div>
            </div>
            <!--<div class="form-group">&gt;</div>-->
            <!--<div class="form-group">-->
            <!--<span>基本信息</span>-->
            <!--</div>-->
        </div>
        <div class="content_main" id="content-main" v-loading="loading">
            <iframe class="J_iframe" id="iframe0" name="main" width="100%" height="100%" :src="main" frameborder="0"></iframe>
        </div>
    </div>
    <div class="modal_tip">
        <div class="modal_zz" >
        </div>
        <div class="logout_modal" >
            <div class="model_info">
                <div class="model_info_title ">
                    <span > 提示</span>
                </div>
                <div class="model_info_cont font_size_14">
                    确定要退出登录吗？<br>
                    are you sure logout ?
                </div>
            </div>
            <div class="font_size_14">
                <div class="btn_save btn_save "  @click="logout()">
                    确认(determine)
                </div>
                <div class="btn_cancel logout_no btn-2" >
                    取消(cancel)
                </div>
            </div>
            <div style="clear: both"></div>
        </div>
    </div>

</div>
</body>
<script src="__JS__/supplies/jquery.min.js"></script>
<script src="__JS__/supplies/bootstrap.min.js"></script>
<script src="__JS__/vue.js"></script>
<script src="__JS__/vue-resource.js"></script>
<script src="__JS__/loading.js"></script>
<script src="__JS__/supplies/router.js"></script>
<script src="__JS__/supplies/common.js"></script>
<script src="__JS__/layer.js"></script>
<script src="__JS__/supplies/index.js"></script>
<script>
    $(function(){
        $(".logout").on("click",function(){
            $(".modal_tip").css("display","block");
        });
        $(".logout_no").on("click",function(){
            $(".modal_tip").css("display","none");

        })
        $(".modal_zz").on("click",function(){
            $(".modal_tip").css("display","none");
        })
    })
</script>
</html>